<!DOCTYPE html>
<html lang="zh-cmn-Hans">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
		<title>新增地址</title>
		<link rel="stylesheet" href="../../css/ui.min.css" />
		<link rel="stylesheet" href="../../css/jquery-ui.css" />
		<link rel="stylesheet" href="../../css/iconfont.css" />
		<link rel="stylesheet" href="../../css/shop.css" />
	</head>
	<body ontouchstart>
		<div id="app">
			<header class="ui-header">
				<a href="javascript:history.go(-1)" class="ui-icon hd-left">
					<span class="iconfont icon-fanhui"></span>
				</a>
				<div class="ui-title">添加收货地址</div>
				<a href="javascript:;" class="icon-text btn-save hd-right" @click="getData">保存</a>
			</header>
			<div class="ui-content">
				<div class="adds-cells">
					<div class="ui-cell ui-input-cell">
						<div class="ui-cell__bd">
							<input type="text" placeholder="收货人" class="ui-input" v-model="consignee" />
						</div>
						<div class="ui-rt-icon">
							<span class="iconfont icon-address-book"></span>
						</div>
					</div>
					<div class="ui-cell ui-input-cell">
						<div class="ui-cell__bd">
							<input type="tel" placeholder="手机号码" class="ui-input" v-model="mobile" />
						</div>
						<div class="ui-rt-select">
							<select name="" id="">
								<option value="">+86</option>
							</select>
						</div>
					</div>
					<div class="ui-cell ui-input-cell">
						<div class="ui-cell__bd">
							<input type="text" placeholder="所在地区" readonly="readonly" class="ui-input" id="City" />
						</div>
						<div class="ui-rt-select"></div>
					</div>
					<div class="ui-cell ui-input-cell">
						<div class="ui-cell__bd">
							<textarea name="" id="" placeholder="详细地址：如街道,门牌号，小区，楼栋号，单元等" v-model="address"></textarea>
						</div>
					</div>
					<div class="ui-cell ui-input-cell">
						<div class="ui-cell__bd">
							<p>默认地址</p>
						</div>
						<div class="ui-cell__ft">
							<input class="ui-switch" v-model="is_acquiesce_address" type="checkbox" />
						</div>
					</div>
				</div>
			</div>
		</div>


	</body>
	<script src="../../js/jquery-2.1.4.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../js/jquery-ui.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../js/mui.js"></script>
	<script src="../../js/city-picker.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../js/vue.min.js"></script>
	<script src="../../js/common/config.js"></script>
	<script type="text/javascript">
		// mui插件初始化
		mui.init();
		mui.plusReady(function() {
			vm.init();
		})

		var vm = new Vue({
			el: "#app",
			data: {
				consignee: "",
				mobile: '',
				province: "",
				address: "",
				city: "",
				district: "",
				is_acquiesce_address:false,
			},
			methods: {
				init() {},
				getData() {
					var _that = this;
					var myreg = /^[1][0-9][0-9]{9}$/;
					var data = {
						request_type: 1,
						user_id: localStorage.getItem('user_id'),
						ress_type: 'add',
						country: 1,
						consignee: _that.consignee,
						mobile: _that.mobile,
						province: 1,
						city: 1,
						district: 1,
						address: _that.address,
					};
					console.log(JSON.stringify(data));
					if (_that.consignee == '') {
						alert("收货人不能为空");
						return false;
					} else if (_that.mobile == '') {
						alert("手机号不能为空");
						return false;
					} else if (!myreg.test(_that.mobile)) {
						alert("请输入正确的手机号码");
						return false;
					} else if (_that.address == '') {
						alert("详细地址不能为空");
						return false;
					} else {
						mui.ajax(Config.api.Add_up_de_ress, {
							data: data,
							type: 'post',
							dataType: 'json',
							success: function(data) {
								console.log(JSON.stringify(data));
								mui.toast('地址添加成功');
								setTimeout(function() {
									var opener = plus.webview.currentWebview().opener();
									opener.reload();
									mui.back();
								}, 500);
							},
							error: function(xhr, type, errorThrown) {
								console.log("接口错误");
							},
						});
					}
				}
			}
		});
		
		$("#City").cityPicker({
			title: "选择地址",
			onClose: function(p, v, dv) {
				$.closeModal()
			},
		});
		$("#City").click(function() {
			$.openModal()
		})
	</script>
</html>
